<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
      function btn() {
      /*通过id选择器获取文本框的值*/
      /*let elementById = document.getElementById("usernameId");
      let value = elementById.value;
      document.write(value);*/
      /*获取所有span标签中的值*/
      /*let elementsByTagName = document.getElementsByTagName("span");
      for (let i = 0; i < elementsByTagName.length; i++) {
        let tag = elementsByTagName[i];
        alert(tag.innerText);
      }*/
      /*获取所有class为spanClass的元素对象*/
        /*let elementsByClassName = document.getElementsByClassName("spanClass");
        for (let i = 0; i < elementsByClassName.length; i++) {
          let cla = elementsByClassName[i];
          alert(cla.innerText);
        }*/
      /*获取name为hobby的元素对象*/
        let elementsByName = document.getElementsByName("hobby");
        alert(elementsByName.length);
      }
    </script>
</head>
<body>
        <input type="text" value="tom" id="usernameId" name="username"/><br />
        <input type="checkbox" name="hobby" value="抽烟" />抽烟<br />
        <input type="checkbox" name="hobby" value="喝酒" />喝酒<br />
        <input type="checkbox" name="hobby" value="烫头" />烫头<br />
        <span class="spanClass">佑我中华</span>
        <span class="spanClass">佑我中华1</span>
        <span>佑我中华2</span><br/>
        <input type="button" value="获取对象" onclick="btn()" />
</body>
</html>